<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <script src="../js/jquery-1.9.1.min.js"></script>
    <link rel="stylesheet" href="../bootstrap-3.3.7-dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="../css/frontpage.css">
    <script src="../bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
    <script src="../js/frontpage.js"></script>
    <title>绘梦之约</title>
</head>

<body>
<div id="top_bar">
    <ul id="ul_title">
        <li style="border-right:1px solid black "><a href="">绘梦大事记</a></li>
        <li style="border-right:1px solid black "><a href="">团本攻略</a></li>
        <li><a href="">公会趣闻</a></li>
        <li id="li_logo"><img src="../images/wow_logo.png" alt="" id="logo"></li>
        <li style="border-right:1px solid black "><a href="">会员管理</a></li>
        <li style="border-right:1px solid black "><a href="">我的资料</a></li>
        <li><a href="">留言板</a></li>
    </ul>
</div>
<div id="mid_bar">
    <!-- <div id="pictureUpload" style="display: none">
      <form action="" id="upload">
        <input type="file" name="avatar" id="avatar">
      </form>
      <button id="submit">上传</button>
    </div> -->

    <div id="showArea">
        <img src="../images/huimengLOGO.png" alt="" id="wow_logo">
        <div id="title_lead">我的资料</div>
        <div id="show_left">
            <ul class="title_left myInfo">
                <li><a href="">我的资料</a></li>
                <li><a href="">修改密码</a></li>
                <li><a href="">添加角色</a></li>
                <li><a href="">修改角色信息</a></li>
            </ul>
        </div>
        <div id="show_right">
            <div id="myInfo" class="myInfo show_right_inner">
                <div id="top">
                    <h4>请选择您的角色</h4>
                    <select name="role" id="role">
                        <option value="">影子的约定</option>
                        <option value="">图拉糖</option>
                        <option value="">出入平安</option>
                    </select>
                    <div id="role_title">角色信息</div>
                </div>
                <div id="mid">
                    <img src="../images/hourse.png" id="picture_role">
                    <div id="role_Info">
                        <table id="table_role">
                            <tr style="background-color: rgb(145, 79, 79,0.5)">
                                <td>角色名：</td>
                                <td></td>
                                <td>等级：</td>
                                <td></td>
                            </tr>
                            <tr style="background-color: rgba(70, 69, 158, 0.363)">
                                <td>服务器：</td>
                                <td></td>
                                <td>工会：</td>
                                <td></td>
                            </tr>
                            <tr style="background-color: rgb(145, 79, 79,0.5)">
                                <td>会阶：</td>
                                <td></td>
                                <td>备注：</td>
                                <td></td>
                            </tr>
                        </table>
                    </div>
                </div>
                <div id="down">
                    <img src="../images/artline.png" style="width: 997px;position: relative;top: -17px;">
                    <div id="title_down">
                        个人信息
                    </div>
                    <div id="personal_Info">
                        <table>
                            <tr>
                                <td>姓名：</td>
                                <td><input type="text" placeholder="可不填" class="input"></td>
                                <td>性别：</td>
                                <td><input type="text" placeholder="可不填" class="input"></td>
                                <td>战网：</td>
                                <td><input type="text" placeholder="可不填" class="input"></td>
                            </tr>
                        </table>
                        <hr>
                        <table>
                            <tr>
                                <td>住址：</td>
                                <td><input type="text" placeholder="方便面基可不填" class="input"></td>
                                <td>性别：</td>
                                <td><input type="text" placeholder="可不填" class="input"></td>
                                <td>战网：</td>
                                <td><input type="text" placeholder="可不填" class="input"></td>
                            </tr>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div id="footer"></div>
</body>

</html>